<template>
    <div class="Management">
        <mt-header fixed title="管理员列表">
            <mt-button icon="back" @click="backprev" slot="left"></mt-button>
        </mt-header>
        <div class="allMun" style="height: 50px;">
            <router-link to="/AddUser">
                 <mt-button type="primary" size="small" style="margin-left: 10px;">添加管理员</mt-button>
            </router-link>
        </div>
        <mt-tab-container style="margin-top: 100px;" >
            <mt-tab-container-item>
                <a class="mint-cell" style="padding: 10px;" v-for="(n,index) in resultData">
                    <div class="mint-cell-left"></div>
                    <div class="mint-cell-wrapper">
                        <div class="mint-cell-title">
                            <span class="mint-cell-text">用户名:{{n.userName | capitalize}}</span>
                            <span class="mint-cell-label">职位:{{n.position}}</span>
                            <span class="mint-cell-label">手机号:{{n.mobile}}</span>
                        </div>
                        <mt-button type="danger" size="small"   style="margin-left: 10px;" @click="operationUser(n.userId,2)">删除</mt-button>

                    </div>
                    <div class="mint-cell-right"></div>
                </a>
            </mt-tab-container-item>
        </mt-tab-container>
    </div>
</template>

<script>
    import {
            loading,
            back,
            addopsuser,
            operopsuser,
            opsuserlist
    } from '../common/api/api';
    import { Toast ,Indicator} from 'mint-ui';
    export default {
        name: 'Management',
        data () {
            return {
                isDj : true,
                createDialog: {
                    opened: false,
                    loading: false
                },
                resultData : []
            }
        },
        components: {
            //Hello
        },
        methods: {
            back : back,
            backprev : function () {
                this.$router.push('/home');
            },
            init : function () {
                var vm = this;
                const params = {

                }
                loading(true);
                opsuserlist(params, {
                    target: vm.createDialog
                })
                        .then((result) => {
                            console.log(result);
                            vm.createDialog.opened = false;
                            if(result.errno == 0){
                                loading(false);
                                vm.resultData = result.data;

                            }else{
                                loading(false);
                                Toast(result.errmsg);
                            }

                        });
            },
            operationUser : function (userId,status) {
                var vm = this;
                const params = {
                    userId : userId,
                    status : status
                };
                loading(true);
                operopsuser(params, {
                    target: vm.createDialog
                })
                        .then((result) => {
                            console.log(result);
                            vm.createDialog.opened = false;
                            if(result.errno == 0){
                                loading(false);
                                Toast(result.data);
                                vm.init()

                            }else{
                                loading(false);
                                Toast(data.errmsg);
                            }

                        });

            }

        },
        created() {
            this.init()
        },
        filters: {
            capitalize: function (value) {
                if(!value || value == null || value == ""){
                    return "不存在"
                }else{
                    return value
                }
            },
        }
    }
</script>
